<template>
    <div>
        <el-dialog v-model="props.visible" title="人员列表" width="100%" @close="handleCancel">
            <div style="display: flex;justify-content: space-between;" >
                <el-form :model="queryParams" ref="queryRef" :inline="true">
                    <el-form-item label="班组" prop="team">
                        <el-select
                            style="width: 100%"
                            v-model="queryParams.team"
                            placeholder="请选择"
                        >
                            <el-option
                                v-for="item in ems_team"
                                :key="item.value"
                                :label="item.label"
                                :value="item.value"
                            />
                        </el-select>
                    </el-form-item>
                <!-- <el-form-item label="员工编号" prop="code">
                  <el-input v-model="queryParams.code" placeholder="请输入员工编号" @keyup.enter="handleQuery" />
              </el-form-item>
              <el-form-item label="员工名称" prop="name">
                  <el-input v-model="queryParams.name" placeholder="请输入员工名称" @keyup.enter="handleQuery" />
              </el-form-item>
              <el-form-item label="手机号码" prop="telephone">
                  <el-input v-model="queryParams.telephone" placeholder="请输入员工手机号码" @keyup.enter="handleQuery" />
              </el-form-item> -->
                <el-form-item>
                    <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
                    <el-button icon="Refresh" @click="resetQuery">重置</el-button>
                </el-form-item>
            </el-form>

            <el-button
                style="margin-bottom: 5px"
                type="primary"
                plain
                @click="handleSubmit"
                :disabled="multiple"
            >
                确认
            </el-button>
            </div>
            <el-table
                v-loading="loading"
                :data="userList"
                ref="people"
                row-key="id"
                stripe
                border
                style="cursor: pointer"
                @selection-change="handleSelectionChange"
            >
                <el-table-column
                    type="selection"
                    :reserve-selection="true"
                    align="center"
                    width="55"
                />
                <el-table-column label="序号" width="60" type="index" align="center" />
                <el-table-column prop="team" label="班组" align="center">
                    <template #default="scope">
                        <dict-tag :options="ems_team" :value="scope.row.team" />
                    </template>
                </el-table-column>
                <el-table-column
                    label="员工编号"
                    align="center"
                    prop="code"
                    
                ></el-table-column>
                <el-table-column
                    label="员工名称"
                    align="center"
                    prop="name"
                    
                />
                <el-table-column prop="position" label="职位" align="center">
                    <template #default="scope">
                        <dict-tag
                            :options="ems_machine_info_position"
                            :value="scope.row.position"
                        />
                    </template>
                </el-table-column>
                <el-table-column
                    prop="proportion"
                    label="岗位占比"
                    align="center"
                ></el-table-column>
                <!-- <el-table-column label="性别" align="center" prop="sex" >
                  <template v-slot="{ row }">
                      {{ row.sex === 1 ? "男" : "女" }}
                  </template></el-table-column>
              <el-table-column label="联系电话" align="center" prop="telephone" >
              </el-table-column> -->
            </el-table>
            <!-- <div class="footer">
                <pagination
                    v-show="total > 0"
                    :total="total"
                    v-model:page="queryParams.pageNum"
                    v-model:limit="queryParams.pageSize"
                    @pagination="getList"
                />
            </div> -->
        </el-dialog>
    </div>
</template>
<script setup>
const emit = defineEmits(['changeUpdate'])
import { getMesUserInfo } from '@/api/basicInfo/personnel'
const { proxy } = getCurrentInstance()
const { ems_machine_info_position, ems_team } = proxy.useDict(
    'ems_machine_info_position',
    'ems_team'
)
const props = defineProps({
    visible: {
        type: Boolean,
        default: false,
    },
    search: {
        type: Object,
        default: () => {
            {
            }
        },
    },
    userWorkList: {
        type: Array,
        default: () => {
            ;[]
        },
    },
})
const people = ref(null)
const multiple = ref(true)
const selectRow = ref([])
const loading = ref(false)
const userList = ref([])
const oldList = ref([])
const queryParams = ref({
    pageNum: 1,
    pageSize: 10,
    joinPositionStatus: 1,
    code: undefined,
    name: undefined,
    telephone: undefined,
})
const total = ref(0)
watch(
    () => props.visible,
    val => {
        if (val) {
            userList.value = props.userWorkList
            oldList.value = props.userWorkList
            // nextTick(() => {
            //     people.value.clearSelection()
            //     if (props.peopleSelectList.length > 0) {
            //         props.peopleSelectList.forEach(item => {
            //             people.value.toggleRowSelection(item, true)
            //         })
            //     }
            // })
        }
    }
)

// 选中
const handleSelectionChange = row => {
    selectRow.value = row
    multiple.value = !row.length
}

const handleSubmit = () => {
    emit('changeUpdate', selectRow.value)
}

const handleCancel = () => {
    proxy.resetForm('queryRef')
    emit('cancel')
}
// const getList = async () => {
//   loading.value = true
//   if (props.search) {
//       queryParams.value = { ...queryParams.value, ...props.search }
//   }
//   const res = await getMesUserInfo(queryParams.value)
//   loading.value = false
//   userList.value = res.rows
//   total.value = res.total
// }
// 搜索
const handleQuery = () => {
    // queryParams.value.pageNum = 1
    if(queryParams.value.team){
     userList.value = oldList.value.filter(item=>item.team ==queryParams.value.team)
    }

}
/** 重置按钮操作 */
const resetQuery = () => {
    proxy.resetForm('queryRef')
    userList.value  = oldList.value
    // handleQuery()
}
// getList()
</script>

<style lang="scss" scoped></style>
